<template>
  <div class="classifys-detail">
    <eagle-tab-page-list
      :url="url"
      :params="params"
      @initActive="_initActive"
      @initList="_initList"
    >
      <div v-if="historyList.length">
        <div
          v-for="(v, i) in historyList"
          :key="i"
          class="history-content"
        >
          <!-- <div class="history-title">【检查对象】{{ v.CFullName }}</div>
					<div class="line"></div> -->
          <div class="history-title">【关键词】{{ v.Keyword }}</div>
          <div class="line"></div>
          <div>【隐患描述】{{ v.HiddenDangerDesc }}</div>
          <div>【整改建议】{{ v.CorrectiveAdvise }}</div>
          <div class="apply-area">
            <div class="detail-collect">
              <img
                src="@/assets/Images/AppIcon/icon_list_industry.png"
                alt=""
              />
              <span>适用地区:{{ v.ApplyArea }}</span>
            </div>
          </div>
          <div class="apply-area">
            <div class="detail-collect">
              <div @click="getDetail(v)">
                <img
                  src="@/assets/Images/AppIcon/icon_list_detail.png"
                  alt=""
                />
                <span>详细</span>
              </div>

              <div
                v-if="v.IsCollected"
                @click="unCollected(v)"
              >
                <img
                  src="@/assets/Images/AppIcon/icon_list_collect.png"
                  alt=""
                />
                <span>取消收藏</span>
              </div>
              <div
                v-else
                @click="Collect(v)"
              >
                <img
                  src="@/assets/Images/AppIcon/icon_list_notcollect.png"
                  alt=""
                />
                <span>收藏</span>
              </div>
              <div
                @click="Ignored(v)"
                v-if="hasPhoto"
              >
                <img
                  src="@/assets/Images/AppIcon/icon_list_ignore.png"
                  alt=""
                />
                <span>忽略该依据</span>
              </div>
            </div>
            <!-- <div class="take-photo">
							<img src="@/assets/Images/AppIcon/icon_camera.png" alt="" />
							<span>拍照</span>
						</div> -->

            <!-- <div class="take-photo" @click="goPhoto(v)">
							<van-uploader
								@oversize="onOversize"
								:after-read="afterRead"
								capture="camera"
							>
								<img src="@/assets/Images/AppIcon/icon_camera.png" alt="" />
								<span>拍照</span>
							</van-uploader>
						</div> -->
            <div
              class="take-photo"
              v-if="hasPhoto"
              @click="goPhoto(v)"
            >
              <van-uploader
                @oversize="onOversize"
                :after-read="afterRead"
                capture="camera"
              >
                <img
                  src="@/assets/Images/AppIcon/icon_camera.png"
                  alt=""
                />
                <span>拍照</span>
              </van-uploader>
            </div>
            <div
              @click="chooseClassifys(v)"
              class="take-photo"
              v-else
            >
              <img
                src="@/assets/Images/AppIcon/icon_list_add.png"
                alt=""
              />
              <span>选择</span>
            </div>
          </div>
        </div>
      </div>
      <div v-else>
        <img
          class="none-data"
          src="@/assets/Images/AppIcon/common_empty_data.png"
          alt=""
        />
      </div>
    </eagle-tab-page-list>

    <!-- 弹出层 -->
    <van-dialog
      v-model="show"
      :showConfirmButton="false"
    >
      <div class="dialog-content">
        <div class="dialog-title">详细信息</div>
        <div class="dialog-content-text">
          <div class="gist-source">
            <span class="dialog-description">来源：</span>{{ detail.GistSource }}
          </div>
          <div class="gist-source">
            <span class="dialog-description">隐患描述：</span>{{ detail.HiddenDangerDesc }}
          </div>
          <div class="gist-source">
            <span class="dialog-description">整改建议：</span>{{ detail.CorrectiveAdvise }}
          </div>
          <div class="gist-source">
            <span class="dialog-description">适用地区：</span>{{ detail.ApplyArea }}
          </div>
          <div class="gist-source">
            <span class="dialog-description">适用行业：</span>{{ detail.ApplyProfessionName }}
          </div>
          <div class="gist-source">
            <span class="dialog-description">法律责任：</span>{{ detail.LegalLiability }}
          </div>
          <div class="gist-source">
            <span class="dialog-description">法律原文：</span>{{ detail.OriginalText }}
          </div>
          <div class="gist-source">
            <span class="dialog-description">法律法规：</span>
            <div
              class="text-list"
              v-for="(v, i) in detail.TextList"
              :key="i"
              @click="toDetail(v)"
            >
              {{ v.Name }}
            </div>
          </div>
        </div>
        <div class="dialog-bottom">
          <div></div>
          <div>
            <span @click="close">取消</span>
            <span
              class="complete-btn"
              @click="confirm"
            >确定</span>
          </div>
        </div>
      </div>
    </van-dialog>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import store from "@/store/index";
import { Toast } from "vant";
export default {
  data() {
    return {
      value: "",
      finished: false,
      loading: false,
      filter: {
        page: 0,
        dataType: "PublicUsed",
        cCode: "",
      },
      historyList: [],
      show: false,
      detail: {},
      vobj: {},
      fileList: [],
      id: "",
      hasPhoto: false,
      url: "/DangerLawGist/GetPageData",
      isJG:false
    };
  },
  created() {
    if(this.$store.state.CompanyType=='JG'){
      this.isJG=true
    }
    if (this.$route.query.hasPhoto) {
      this.hasPhoto = this.$route.query.hasPhoto;
    }
    if (this.$route.params.id || this.$route.params.id == 0) {
      this.id = this.$route.params.id;
      const ClassifysData = this.$route.params;
      console.log("ClassifysData", ClassifysData);
      this.$store.commit("setClassifysData", ClassifysData);
    }
    if (this.$route.query.cName) {
      store.commit("updateTitle", this.$route.query.cName);
    }
    this.filter.cCode = this.$route.query.cCode;
    this.filter.applyProfession=this.$route.query.applyProfession
    this.filter.applyArea=this.$store.state.area

    this.getHistoryFrequency();
  },
  computed: {
    ...mapGetters(["classifysChildren"]),
    params: {
      get: function () {
        let paramArr = [];
        if (this.classifysChildren && this.classifysChildren.length > 0) {
          for (var i = 0; i < this.classifysChildren.length; i++) {
            paramArr.push({
              title: this.classifysChildren[i].text,
              name: this.classifysChildren[i].CCode,
              cCode: this.classifysChildren[i].CCode,
            });
          }
        }
        return paramArr;
      },
    },
  },
  activated() {},
  // beforeRouteLeave(to, from, next) {
  // 	to.params.path = this.$route.params.path
  // 	to.params.id = this.$route.params.id
  // 	next() //继续下一步
  // },
  methods: {
    _initActive(active) {
      this.active = active;
    },
    _initList(list) {
      this.historyList = list;
    },
    onClick(name, title) {
      this.filter.cCode = name;
      this.filter.page = 0;
      this.getHistoryFrequency();
      // console.log('asdad',name);
    },

    onSearch() {
      this.filter.page = 0;
      this.filter.keywords = this.value;
      this.getHistoryFrequency();
    },
    clearSearch() {
      this.filter.page = 0;
      this.filter.keywords = "";
      this.getHistoryFrequency();
    },
    // 选择检查依据
    chooseClassifys(item) {
      // if (this.id || this.id == 0) {
      // 	this.$router.push({
      // 		name: this.$route.params.path,
      // 		params: {
      // 			classifysData: item,
      // 		},
      // 	})
      // }
      this.id = this.$store.state.ClassifysData.id;
      const path = this.$store.state.ClassifysData.path;
      if (this.id || this.id == 0) {
        this.$router.push({
          name: path,
          params: {
            classifysData: item,
            id: this.id,
          },
        });
      }
    },
    goPhoto(item) {
      this.vobj = item;
    },
    // 上传图片
    afterRead(file) {
      let params = new FormData(); //创建form对象
      params.append("file", file.file);
      let _this = this;
      let url= this.isJG?'DangerCheckTaskDetailEdit_JG':'DangerCheckTaskDetailEdit'
      _this.$axios
        .post("/Attachment/UploadFiles", params)
        .then((res) => {
          res.data.forEach((item) => {
            _this.vobj.DFullName =
              _this.vobj.DTypeName + ">" + _this.vobj.DName;
            _this.fileList.push(item.FilePath);
            _this.$router.push({
              name: url,
              params: {
                file: item.FilePath,
                vobj: _this.vobj,
              },
              query: {
                ctCode: _this.$route.query.ctCode || "",
                originType: 2,
              },
            });
          });
        })
        .catch((err) => {
          console.log("err", err);
        });
    },
    onOversize(file) {
      Toast("文件大小不能超过 2M");
    },
    onLoad() {
      this.loading = true;
      ++this.filter.page;
      console.log("filter")
      console.log(this.filter)
      let _this = this;
      _this.$axios
        .get("/DangerLawGist/GetPageData", { params: _this.filter })
        .then((res) => {
          _this.loading = false;
          _this.filter.page = res.data.PageIndex;
          _this.historyList = _this.historyList.concat(res.data.Data);
          if (!res.data.HasNextPage) {
            _this.finished = true;
          }
        });
    },
    getHistoryFrequency() {
      this.loading = true;
      let _this = this;
      _this.$axios
        .get("/DangerLawGist/GetPageData", { params: _this.filter })
        .then((res) => {
          _this.loading = false;
          if (!res.data.HasNextPage) {
            _this.finished = true;
          }
          _this.filter.page = res.data.PageIndex;
          _this.historyList = res.data.Data;
        });
    },
    // 收藏
    Collect(item) {
      const param = {
        lgCode: item.LGCode,
      };
      let _this = this;
      _this.$axios
        .get("/DangerLawGist/Collect", { params: param })
        .then((res) => {
          _this.filter.page = 0;

          _this.getHistoryFrequency();
        });
    },
    // 取消收藏
    unCollected(item) {
      const param = {
        lgCode: item.LGCode,
      };
      let _this = this;
      _this.$axios
        .get("/DangerLawGist/UnCollected", { params: param })
        .then((res) => {
          _this.filter.page = 0;

          _this.getHistoryFrequency();
        });
    },
    // 详细getDetail
    getDetail(item) {
      const param = {
        lgCode: item.LGCode,
      };
      this.show = true;
      let _this = this;
      _this.$axios
        .get("/DangerLawGist/GetDetail", { params: param })
        .then((res) => {
          res.data.TextList = JSON.parse(res.data.TextList);
          _this.detail = res.data;
        });
    },
    Ignored(item) {
      const param = {
        lgCode: item.LGCode,
      };
      const _this = this;
      this.$dialog
        .confirm({
          title: "询问",
          message: "确定要忽略此条依据吗？",
        })
        .then(() => {
          let _this = this;
          _this.$axios
            .get("/DangerLawGist/UnInterested", { params: param })
            .then((res) => {
              _this.getHistoryFrequency();
            });
        })
        .catch(() => {
          // on cancel
        });
    },
    // 关闭
    close() {
      this.show = false;
    },
    confirm() {
      this.show = false;
    },
  },
};
</script>
<style lang="less" scoped>
.info_search {
  padding: 10px;
  border-radius: 5px !important;
  .van-field__control {
    background-color: #ffffff !important;
  }
}
</style>
<style lang="less" scoped>
.classifys-detail {
  min-height: 100vh;
  background-color: #e8f1f8;
}
.all_dep {
  background-color: #ffffff;
}

.history-content {
  overflow: hidden;
  padding: 10px;
  background-color: #fff;
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.3;
  .line {
    width: 100%;
    height: 0.5px;
    background-color: #eee;
    margin: 5px;
  }
}
.none-data {
  width: 100%;
  height: 100%;
}

.apply-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 15px;
  .detail-collect {
    display: flex;
    align-items: center;

    > div {
      font-size: 14px;
      display: flex;
      align-items: center;
      margin-right: 10px;
    }
  }
  .take-photo {
    display: flex;
    align-items: center;
    img {
      width: 16px;
      height: 18px;
      vertical-align: middle;
    }
  }
  img {
    width: 16px;
    height: 16px;
    margin-right: 5px;
  }
}
</style>
